<!DOCTYPE html>
<html lang="en" style="height: 100%">
<head>
    <meta charset="utf-8">
</head>
<body style="height: 100%; margin: 0">
<div id="container" style="height: 100%"></div>
<script type="text/javascript" src="https://registry.npmmirror.com/echarts/5.5.1/files/dist/echarts.min.js"></script>
<script src="js/jquery.js"></script>
<script type="text/javascript">
    $(function () {
        $.post("/sms/offlineSchool/classServlet.do", "method=findClassCount", function (res) {
            // result:[['Java301', 'Python302', 'Golang303', 'JavaScript304', 'ArkTS305', '仓颉306', 'C#307'],[120, 200, 150, 80, 70, 110, 130]]
            var dom = document.getElementById('container');
            var myChart = echarts.init(dom, null, {
                renderer: 'canvas',
                useDirtyRect: false
            });
            var app = {};

            var option;

            option = {
                xAxis: {
                    type: 'category',
                    data: res[1]
                },
                yAxis: {
                    type: 'value'
                },
                series: [
                    {
                        data: res[0],
                        type: 'bar'
                    }
                ]
            };

            if (option && typeof option === 'object') {
                myChart.setOption(option);
            }
        }, "json")
    })
    window.addEventListener('resize', myChart.resize);
</script>
</body>
</html>